<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <title>Welcome to Clock Online System</title>
        <link href="../css/default.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="../js/jquery-1.11.1.min.js"></script>
    </head>
   
    <body>
        <div id="wrapper">
        <!-- Common Header for our site -->
		<div id="header">
		    <div id="logo">
		        <h1><a href="../login/index.html">Face Clock</a></h1>
		        <h2><a href="../login/index.html">Serving Guests Since 2017</a></h2>
		    </div>
		    <!-- end div#logo -->
		    <!-- end div#menu -->
		</div>
            <!-- end div#header -->
            <div id="page">
                <div id="content">
                 <h2></h2>
                    <h1>Login</h1>
                <table>
                <tr><td  class="login">User Name:</td><td><input type="text" name="username" id="username" value="" style="width: 220px" /></td></tr>
                <tr><td  class="login">Password:</td><td><input type="password" name="password" id="password" value="" style="width: 220px" /></td></tr>
                <tr><td colspan="2"><input type="button" value="login"/></td></tr>
                </table>
                <a href="../login/index.html">Login via EmpID and Password</a><br />
                <a href="../login/cameralogin.html">Login via Face</a><br />
                <a href="../login/cameraregister.html">Register</a>
                    
                </div>
                <!-- end div#content -->
                <div id="sidebar">
                </div>
                <!-- end div#sidebar -->
                <div style="clear: both; height: 1px"></div>
            </div>
            <!-- Common footer for our site -->
			<div id="footer">
			    <p id="legal">Copyright &copy; 2017  Infosys. All Rights Reserved.<br/>
			    </p>
			</div>
        </div>
        <!-- end div#wrapper -->
    </body>
<script type="text/javascript">
var token = "";
function login(){
	$.ajax({
		type : "post",
		url : "../loginfacade/loginFacade",
		dataType : 'json',
		data : {
			username : $("#username").val(),
			password : $("#password").val(),
		},
		success : function(data, textStatus) {
			if (data.success) {
				token = data.token;
				var url = data.forwardUrl;
				window.location.href = url+"?token="+token
			}
		},
		complete : function(XMLHttpRequest, textStatus) {
		},
		error : function(XMLHttpRequest, textStatus, errorThrown) {
			alert("Error:" + textStatus);
			alert(errorThrown.toString());
		}
	});
}
</script>
</html>
